<template>
  <div class="index-container">
    <!-- 占位符 -->
    <!--  底部跳转的导航页面    内容区域 -->
    <div class="body-container">
      <router-view></router-view>
    </div>
    <!-- 底部tab栏切换 -->
    <van-tabbar route>
      <van-tabbar-item replace to="/tabbar/home" icon=" iconfont icon-shouyeshouye ">标签</van-tabbar-item>
      <van-tabbar-item replace to="/tabbar/sort" icon=" iconfont icon-fenlei ">分类</van-tabbar-item>
      <van-tabbar-item replace to="/tabbar/cart" icon=" iconfont icon-gouwuche ">购物车</van-tabbar-item>
      <van-tabbar-item replace to="/tabbar/user" icon=" iconfont icon-yonghu ">个人</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: 'YanxuanshangchengIndex',

  data() {
    return {}
  },

  mounted() {},

  methods: {}
}
</script>

<style lang="less" scoped>
.van-tabbar {
  height: 5rem;
  .van-tabbar-item {
    font-size: 1.2rem;
  }
  .ii {
    font-size: 1.2rem;
  }
}
.body-container {
  background-color: #f4f4f4;
  // padding-bottom: 45px;
  // 减去底部的tab栏切换 高度
  max-height: calc(100vh - 5rem);
  overflow: auto;
  &::-webkit-scrollbar {
    display: none;
  }
}
</style>
